বুটস্ট্রাপ ড্রপডাউন মেনু হলো একটি টোগল মেনু যেটি পূর্বনির্ধারিত লিষ্ট থেকে একটি ভ্যালু পছন্দ/সিলেক্ট করতে সাহায্য করে।
নিচের উদাহরণে একটি বেসিক ড্রপডাউন তৈরি করে দেখানো হলোঃ
kt_satt_skill_example_id=1100
.dropdown
ক্লাসের মাধ্যমে ড্রপডাউন মেনুকে বুঝায়।
ড্রপডাউন মেনুকে অপেন করতে বাটন অথবা লিংক এর সাথে .dropdown-toggle
ক্লাস এবং data-toggle="dropdown"
এট্রিবিউট ব্যবহার করুন।
.caret
ক্লাসের দ্বারা একটি ক্যারেট চিহ্ন তৈরি হয় (), যেটি দ্বারা বুঝা যায় যে এটি একটি ড্রপডাউন বাটন।
প্রকৃত ড্রপডাউন মেনু তৈরি করতে
এলিমেন্টে .dropdown-menu
ক্লাস যুক্ত করুন।
ড্রপডাউন মেনুর মধ্যে লিংকগুলোকে আলাদা করার জন্য .divider
ক্লাস ব্যবহার করা হয়ঃ
kt_satt_skill_example_id=1101
ড্রপডাউন মেনুর মধ্যে হেডার যুক্ত করার জন্য .dropdown-header
ক্লাস ব্যবহার করুনঃ
kt_satt_skill_example_id=1102
ড্রপডাউন মেনুর কোনো একটি আইটেমকে ডিসেবল করার জন্য .disabled
ক্লাস ব্যবহার করুন।
ড্রপডাউন মেনুকে ডান পাশে নেওয়ার জন্য .dropdown-menu
ক্লাসের সাথে .dropdown-menu-right
ক্লাস ব্যবহার করুন।
যদি আপনি ড্রপডাউন মেনুকে নিচের দিকে প্রদর্শনের পরিবর্তে উপরের দিকে প্রদর্শন করতে চান, তাহলে kt_satt_skill_example_id=1103 যখন ড্রপডাউন মেনু তৈরি করবেন তখন kt_satt_skill_example_id=1104"dropdown"
ক্লাসের পরিবর্তে "dropup"
ক্লাস ব্যবহার করুনঃবুটস্ট্রাপ ড্রপডাউন এক্সেসিবিলিটি
role
এবং aria-*
এট্রিবিউট ব্যবহার করবেন, এতে স্ক্রিন রিডারদের ব্যবহারে সুবিধা হবেঃএকনজরে ড্রপডাউন সংক্রান্ত ক্লাসগুলো দেখে নেইঃ
ক্লাস বর্ণনা .dropdown
একটি ড্রপডাউন মেনুকে নির্দেশ করে। .dropdown-menu
একটি ড্রপডাউন মেনু তৈরী করে। .dropdown-menu-right
ড্রপডাউন মেনুকে ডানে এ্যালাইন করে। .dropdown-header
ড্রপডাউন মেনুর মধ্যে একটি হেডার যুক্ত করে। .dropup
একটি ড্রপআপ মেনুকে নির্দেশ করে। .disabled
ড্রপডাউন মেনুর একটি আইটেমকে ডিজেবল করে রাখার জন্য ব্যবহার করা হয়। .divider
ড্রপডাউন মেনুর আইটেমগুলোকে হরিজন্টাল লাইনের মাধ্যমে আলাদা করার জন্য ব্যবহার করা হয়।
আরও দেখুন...